:root {
    --background: #f2f2f2;
    --primary: #409EFF;
    --shadow: #ddd;
    --border: #ddd;
    --danger: rgb(233, 47, 47);
}

[class^="bi-icon-"],
[class*=" bi-icon-"] {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body {
    margin: 0;
    font-size: 13px;
}

/*布局start*/

#app {
    min-width: 1200px;
    margin: 0 auto;
    font-family: "Helvetica Neue", "PingFang SC", Arial, sans-serif;
}

.wrapper {
    height: 100%;
    position: relative;
}

.el-header {
    padding: 0 10px;
    color: #fff;
    position: fixed !important;
    top: 0;
    width: 100%;
    z-index: 999;
    background: #545c64;
    color: #fff;
    .logo {
        width: 180px;
        float: left;
        padding: 10px 10px 10px 0;
        margin-right: 20px;
        font-size: 24px;
        line-height: 40px;
        color: #fff;
        position: relative;
        z-index: 1;
        text-align: left;
        img{
            height: 40px;
            margin-right: 5px;
        }
    }
    .el-dropdown {
        color: #fff;
        cursor: pointer;
    }
    .el-button--text {
        color: #fff;
        padding-top: 5px;
        padding-bottom: 5px;
    }
    a {
        color: #fff;
        text-decoration: none;
    }
    i {
        font-size: 16px;
    }
}
.el-main{
    position: absolute;
    top: 60px;
    width: 100%;
    height: calc(100% - 60px);
    padding: 15px;
    overflow: auto;
}


.bui-cols {
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    align-items: center;
}

@for $i from 1 to 12 {
    .bui-col-#{$i} {
        -webkit-box-flex: $i;
        -webkit-flex: $i;
        flex: $i;
        overflow: hidden;
    }
}

/*布局end*/

.text-center {
    text-align: center;
}

.text-left {
    text-align: left;
}

.text-right {
    text-align: right;
}

.text-danger{
    color: var(--danger);
}

.fl {
    float: left;
}

.fr {
    float: right;
}

.p5 {
    padding: 5px !important;
}

.p10 {
    padding: 10px !important;
}

.p15 {
    padding: 15px !important;
}

.fs14 {
    font-size: 14px !important;
}

.ovh {
    overflow: hidden;
}

.ell {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.block {
    display: block;
}

.dib {
    display: inline-block;
}
@each $i in 0, 5, 10, 15, 20, 25, 30 {
    .m#{$i} {
        margin: #{$i}px !important;
    }
    .mt#{$i} {
        margin-top: #{$i}px !important;
    }
    .mb#{$i} {
        margin-bottom: #{$i}px !important;
    }
    .ml#{$i} {
        margin-left: #{$i}px !important;
    }
    .mr#{$i} {
        margin-right: #{$i}px !important;
    }
    .p#{$i} {
        padding: #{$i}px !important;
    }
    .pt#{$i} {
        padding-top: #{$i}px !important;
    }
    .pr#{$i} {
        padding-right: #{$i}px !important;
    }
    .pb#{$i} {
        padding-bottom: #{$i}px !important;
    }
    .pl#{$i} {
        padding-left: #{$i}px !important;
    }
}
.p8 {
    padding: 8px !important;
}

@each $i in 100, 194, 200, 300, 700, 500, 900, 1200 {
    .w#{$i} {
        width: #{$i}px !important;
    }
}

.el-table thead th {
    background: #f5f7fa;
    color: #333;
}

.el-steps--horizontal {
    width: 600px;
    margin: 0 auto;
}

.el-button [class*="bi-icon-"] + span {
    margin-left: 5px;
}
.el-card__header {
    background-color: var(--background);
    border-bottom-color : var(--border);
}

.el-button--primary.el-button--reset{
    border: 1px solid #dcdfe6;
    color: #606266;
    background:#fff;
}
